<template>
  <div>
    {{ users }}
  </div>
</template>

<script lang='ts' setup>
import axios from 'axios'
import {onMounted,ref} from 'vue'
interface GeoType{
  lat:string
  lng:string
}
interface AddressType{
  street: string
  suite: string
  city: string
  zipcode: string
  geo:GeoType
}
interface CompanyType{
  name: string
  catchPhrase: string
  bs: string
}
interface UserType{
    id: number
    name:string
    username: string
    email:string
    address:AddressType
    phone: string
    website: string
    company:CompanyType
}
const getUsers=async()=>{  
  const result=await axios.get('http://jsonplaceholder.typicode.com/users')
  users.value=result.data;
}
let users=ref<Array<UserType>>([])
onMounted(()=>{
  getUsers()
})

</script>

<style lang='scss' scoped>
</style>